<template>
  <view class="order-info-comp">
    <view class="form-content">
      <orderForm ref="orderForm" :form-value="formData" :form-list="formList" img-show />
    </view>
    <view class="btn-content" v-if="submitShow">
      <button class="login-btn cu-btn block bg-blue lg" @click="submit">处理工单</button>
    </view>
  </view>
</template>

<script>
  import orderForm from '../../pages/common/order-form/orderForm';
  
  const formList = [
    {
      name: '设备名称',
      code: 'eqName',
      disable: true,
    },
    {
      name: '工单编号',
      code: 'workCode',
      disable: true,
    },
    {
      name: '申请单号',
      code: 'requestCode',
      disable: true,
    },
    {
      name: '申请人',
      code: 'requestByName',
      disable: true,
    },
    {
      name: '申请时间',
      code: 'requestTime',
      disable: true,
    },
    {
      name: '派单人',
      code: 'createByName',
      disable: true,
    },
    {
      name: '派单时间',
      code: 'createTime',
      disable: true,
    },
    {
      name: '接单人',
      code: 'worker',
      disable: true,
    },
    {
      name: '科室验收人',
      code: 'workReceiveByName',
      disable: true,
    },
    {
      name: '科室验收时间',
      code: 'workReceiveDate',
      disable: true,
    },
    {
      name: '故障说明',
      code: 'requestRemark',
      type: 'textarea',
      disable: true,
    },
    {
      name: '处理情况',
      code: 'workReceiveRemark',
      type: 'textarea',
    },
  ];
  
  export default {
    name: 'OrderInfo',
    components: { orderForm },
    props: {
      formData: {
        type: Object,
        default() {
          return {};
        },
      },
      submitShow: {
        type: Boolean,
        default: false,
      },
    },
    data() {
      return {
        formList,
      };
    },
    methods: {
      submit() {
        this.$emit('submit');
      },
    },
  };
</script>

<style lang="scss" scoped>
  .order-info-comp {
    &, * {
      box-sizing: border-box;
    }
    
    height: 100vh;
    background-color: white;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    
    .form-content {
      flex: 1;
      padding: 10px;
      overflow: auto;
      /deep/ .order-form {
        .form-main-content {
          .uni-forms {
            table {
              tr {
                td {
                  .uni-forms-item {
                    .uni-forms-item__label {
                      width: 100px;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
    
    .btn-content {
      padding: 10px;
    }
  }
</style>
